<template>
    <van-grid :border="false" :column-num="2">
    <van-grid-item v-for="image in photos" :key="image" >
      <img :src="image.src" />
      <van-text v-text="image.text"/>
      <van-text v-text="image.price"/>
    </van-grid-item>
  </van-grid>


</template>

<script setup>
import { reactive, ref } from 'vue';
import new1 from '/images/new1.jpg'
import new2 from '/images/new2.jpg'
import new3 from '/images/new3.jpg'
import new4 from '/images/new4.jpg'
const photos = reactive([
{ text: '懒人小沙发', price: '128.00' ,src:new1},
  { text: '减压弹力球',  price: '89.00' ,src:new2},
  { text: '简约一字夹发夹', price: '12.8' ,src:new3},
  { text: '毛线小兔子耳朵发夹' , price: '9.9' ,src:new4}
])
</script>

<style scoped>
img {
  height: 100%;
  width: 100%;
}
</style>